<%@page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="commons/tags.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<%@ include file="commons/meta.jsp"%>
<title>添加悦读</title>
<link href="${ctx}/js/uploadify/uploadify.css" rel="stylesheet"
	type="text/css" />
<script type="text/javascript" src="${ctx}/js/jquery-1.8.0.min.js"></script>
<script type="text/javascript"
	src="${ctx}/js/uploadify/jquery.uploadify-3.1.js"></script>
<link href="${ctx}/css/form.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="${ctx}/js/ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="${ctx}/js/ckfinder/ckfinder.js"></script>
<script src="${ctx}/js/ckeditor/sample.js" type="text/javascript"></script>
<script type="text/javascript" src="${ctx}/js/jquery.validate.js"></script>
<link href="${ctx}/css/ckeditor/sample.css" rel="stylesheet"
	type="text/css" />
<script type="text/javascript">
	$(function() {
		$("#picFile").uploadify({
			height : 30,
			swf : '${ctx}/js/uploadify/uploadify.swf',
			uploader : '${ctx}/yuedu/uploadFile',
			width : 120,
			fileTypeDesc : 'image files',
			fileTypeExts : '*.gif; *.jpg; *.png;*.GIF; *.JPG; *.PNG',
			buttonText : '浏览',
			onUploadSuccess : function(file, data, response) {
				$("#demoPic").attr("src", "${ctx}/${yueduPicPath}" + data);
				$("#importpic").attr("value", data);
			}
		});
	});
	$.validator.setDefaults({
		ignore : ''
	});

	$().ready(function() {
		// validate signup form on keyup and submit
		$("#signupForm").validate({
			rules : {
				title : "required",
				jianjie : "required",
				weight : {
					required : true,
					number : true
				},
				lanmu : "required",
				importpic : "required",
				content : "required"
			},
			messages : {
				title : "请输入悦读标题",
				jianjie : "请输入悦读简介",
				weight : {
					required : "请输入悦读权重",
					number : "请输入数字"
				},
				lanmu : "请选择栏目",
				importpic : "请上传悦读图片文件",
				content : "请输入悦读详细内容"
			}

		});
	});
</script>
</head>
<body>
	<div id="container">
		<div id="middlecontent">
			<form id="signupForm" action="${ctx}/yuedu/add" method="post">
				<div id="divform">

					<div class="fielddiv">
						<label> 文章标题: </label> <input type="text" name="title"
							class="input" />
					</div>
					<div class="fielddiv">
						<label> 权重: </label> <input type="text" name="weight"
							class="input" />
					</div>
					<div class="fielddiv">
						<label> 栏目: </label> <select name="flanmu" class="input">
							<c:forEach items="${applicationScope.firstLanmu}" var="flanmu">
								<option value="${flanmu.id}">${flanmu.name}</option>
							</c:forEach>
						</select> <br /> <br /> <label> 二级栏目: </label>
						<table class="input">
							<tr>
								<c:forEach items="${applicationScope.secondLanmu}" var="slanmu">
									<td><input type="checkbox" id="lanmu" name="lanmu"
										value="${slanmu.id }" />&nbsp;${slanmu.name }</td>
								</c:forEach>
							</tr>
						</table>
					</div>

					<div class="fielddiv">
						<label> 缩略图: </label>
						<div id="jqueryFile">
							<input type="file" name="picFile" id="picFile" /> <input
								type="hidden" id="importpic" name="importpic" class="required" />
						</div>
						<img id="demoPic" src="images/video_demo.jpg" width="400"
							height="300" alt="预览截图" />
					</div>
					<div class="fielddiv">
						<label> 文章简介: </label>
						<textarea rows="5" cols="50" name="jianjie"></textarea>
					</div>
					<div class="fielddiv">
						<label> 文章内容: </label>
					</div>
				</div>
				<div class="editordiv">
					<textarea name="content" id="content" class="ckeditor"></textarea>
				</div>

				<div class="center">
					<input type="submit" value="提交" class="buttom" /> <input
						type="reset" value="清空" class="buttom" />
				</div>

			</form>
		</div>
	</div>

</body>
</html>